﻿@using xConnected.Common.ExpertProfile
@using xConnected.Common.Project
<div class="modal-middle hide fade" id="TechnologiesCompanyDialog" style="display: none;" >
    <div class="modal-header">
    </div>
    <div class="modal-body" >
        <div class="thumbnail"  style="margin-bottom: 20px">
            <div style="margin-left: 10px; margin-right: 10px; margin-bottom: 10px; margin-top: 10px">
                <div class="row">
                    <span class="span4"><strong>@Resources.AddTechnology</strong></span>
                    <div class="span4" style="padding-top: 10px">
                        <div class="row-fluid">
                            <div class="span9"><input type="text" id="TechnologiesCompanyEditMode" class="span12"/></div>
                            <div style="padding-top: 0px; padding-left: 0px;" class="span1"><a class="btn" href="#" data-bind="click:function() { $root.company.createAndAddTechnology($data); }"><i class="icon-plus"></i></a></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="thumbnail" style="margin-bottom: 10px">
            <div data-bind="with:company" style="margin-left: 10px; margin-right: 10px; margin-bottom: 10px; margin-top: 10px">
                <div data-bind="with: workingCompanyBuffer">
                    <div class="row-fluid">
                        <span class="span4"><strong>@ProjectRes.SelectedTechnologies</strong></span>
                    </div>
                    <div>
                        <ul data-bind="foreach: Technologies" class="unstyled">
                            <li class="row-fluid" style="margin-bottom: 5px">
                                <button class="btn btn-small" data-bind="click: function() { $root.company.removeTechnology($data); }"><span data-bind="text: Name"></span> <i class="icon-remove"></i></button>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
<div class="modal-footer">
    <a href="#" class="btn btn-small btn-info" data-bind="click: function() { $root.company.okTechnologies();}"><strong>@Resources.Ok</strong></a>
    <a href="#" class="btn btn-small" data-bind="click: function() { $root.company.cancelTechnologies();}"><strong>@Resources.Cancel</strong></a>
</div>
</div>